<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>财务</title>

    <script src="/ss/static/js/jquery/jquery-2.1.4.min.js" type="text/javascript"></script>
    <script src="/ss/static/layui/layui.js" type="text/javascript"></script>
    <script src="/ss/static/js/index/index.js" type="text/javascript"></script>
    <script src="/ss/static/layui/lay/modules/layer.js" type="text/javascript"></script>
    <script src="/ss/static/js/index/sliders.js" type="text/javascript"></script>
    <script src="/ss/static/js/index/html5.js" type="text/javascript"></script>
    <script src="/ss/static/js/index/freezeheader.js" type="text/javascript"></script>
    <script src="/ss/static/js/custom.js" type="text/javascript"></script>
    <link rel="stylesheet" href="/ss/static/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/ss/static/layui/css/modules/layer/default/layer.css"/>
    <link rel="stylesheet" href="/ss/static/css/global.css"/>
</head>

<body>
<div th:replace="template.html::header"></div>

<div class="layui-container container">
    <div class="layui-row layui-col-space20">
        <div class="layui-col-md10">
            <form class="layui-form" method="post" action="finances">
                <div class="layui-form-item" style="display: flex;justify-content: center;">
                    <div class="layui-input-inline" style="width:76%;">
                        <input type="number" min=1 name="aid" lay-verify="required" placeholder="请输入社团id"
                               class="layui-input">
                    </div>
                    <button class="layui-btn" lay-filter="*" lay-submit="">搜索</button>
                </div>
            </form>
            <div class="article-main">
                <h2 th:if="${association_name==null}">
                    财务列表
                </h2>
                <h2 th:if="${association_name!=null}" th:text="${association_name} + 的财务列表">
                </h2>
                <div class="article-list" th:each="finance : ${finances}">
                    <h3>
                        <a th:text="'财务号: ' + ${finance.getFid()}"></a>
                    </h3>
                    <p th:text="'使用描述: ' + ${finance.getUsage()}"></p>
                    <p class="autor">
                        <span>
                            <svg style="vertical-align: middle" width="15" height="15" viewBox="0 0 48 48"
                                 fill="none"
                                 xmlns="http://www.w3.org/2000/svg"><path
                                    d="M39 7H9C6.23858 7 4 9.23858 4 12V36C4 38.7614 6.23858 41 9 41H39C41.7614 41 44 38.7614 44 36V12C44 9.23858 41.7614 7 39 7Z"
                                    fill="none" stroke="#333" stroke-width="4" stroke-linejoin="round"/><path
                                    d="M18 15L24 21L30 15" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M17 23H31" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><path
                                    d="M17 29H31" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M24 23V34" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round"
                                                                   stroke-linejoin="round"/></svg>
                            <a th:text="${finance.getMoney()}"></a>
                        </span>
                        <span>
                            <svg style="vertical-align: middle" width="15" height="15" viewBox="0 0 48 48" fill="none"
                                 xmlns="http://www.w3.org/2000/svg"><rect x="4" y="4" width="40" height="40" rx="2"
                                                                          fill="none" stroke="#333" stroke-width="4"
                                                                          stroke-linecap="round"
                                                                          stroke-linejoin="round"/><path
                                    d="M4 14H44" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><line x1="44" y1="11" x2="44" y2="23" stroke="#333"
                                                                   stroke-width="4" stroke-linecap="round"
                                                                   stroke-linejoin="round"/><path d="M12 22H16"
                                                                                                  stroke="#333"
                                                                                                  stroke-width="4"
                                                                                                  stroke-linecap="round"
                                                                                                  stroke-linejoin="round"/><path
                                    d="M22 22H26" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M32 22H36" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><path
                                    d="M12 29H16" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M22 29H26" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><path
                                    d="M32 29H36" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M12 36H16" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><path
                                    d="M22 36H26" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M32 36H36" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><line
                                    x1="4" y1="11" x2="4" y2="23" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/></svg>
                            <a th:text="${#dates.format(finance.getTime(), 'yyyy-MM-dd HH:mm:ss')}"></a>
                        </span>
                        <span th:if="${user.getRole().equals('admin')}">
                            <svg style="vertical-align: middle" width="15" height="15"
                                 viewBox="0 0 48 48" fill="none"
                                 xmlns="http://www.w3.org/2000/svg"><path d="M7 42H43"
                                                                          stroke="#333"
                                                                          stroke-width="4"
                                                                          stroke-linecap="round"
                                                                          stroke-linejoin="round"/><path
                                    d="M11 26.7199V34H18.3172L39 13.3081L31.6951 6L11 26.7199Z" fill="none"
                                    stroke="#333"
                                    stroke-width="4" stroke-linejoin="round"/></svg>
                            <a style="cursor: pointer"
                               th:onclick="'openPanel('+${finance.getFid()}+', \'finance\')'">编辑</a>
                        </span>
                        <span th:if="${user.getRole().equals('admin')}">
                            <svg width="15" height="15" viewBox="0 0 48 48" fill="none"
                                 xmlns="http://www.w3.org/2000/svg" style="vertical-align: middle;"><path
                                    d="M9 10V44H39V10H9Z" fill="none" stroke="#333" stroke-width="4"
                                    stroke-linejoin="round" style="
"></path><path d="M20 20V33" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"></path><path
                                    d="M28 20V33" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"></path><path d="M4 10H44" stroke="#333" stroke-width="4"
                                                                         stroke-linecap="round"
                                                                         stroke-linejoin="round"></path><path
                                    d="M16 10L19.289 4H28.7771L32 10H16Z" fill="none" stroke="#333" stroke-width="4"
                                    stroke-linejoin="round"></path></svg>
                            <a style="cursor: pointer"
                               th:onclick="'deleteEntity('+${finance.getFid()}+', \'finance\')'">删除财务</a>
                        </span>
                    </p>
                </div>
            </div>
            <!--分页-->
            <div id="page"></div>
        </div>
    </div>

    <div id='finance-panel'
         style="left: 0;top:0;right: 0;bottom:0;display: none;justify-content: center;align-content: center;position: fixed;z-index: 10;background-color: rgba(0,0,0,0.5)">
        <div style="width: auto;height: auto;padding: 0 100px;border-radius: 30px;display: flex;flex-direction: column;align-items: center;align-self: center;background-color: whitesmoke">
            <h2 style="font-weight: bold;font-size: 25px;margin-top: 30px">修改财务信息</h2>
            <div style="display: flex;margin-top: 20px;">
                <p style="align-self: center">社团id:&nbsp;</p>
                <input type="number" min=1 class="layui-input" style="align-self: center;width: 200px" id="finance-aid">
            </div>
            <div style="display: flex;margin-top: 20px;">
                <p style="align-self: center">金额:&nbsp;</p>
                <input type="number" min=1 class="layui-input" style="align-self: center;width: 200px"
                       id="finance-money">
            </div>
            <div style="display: flex;margin-top: 20px;">
                <p style="align-self: center">时间:&nbsp;</p>
                <input type="datetime-local" class="layui-input" style="align-self: center;width: 200px"
                       id="finance-time"/>
            </div>
            <div style="display: flex;margin-top: 20px;">
                <p style="align-self: center">使用描述:&nbsp;</p>
                <input class="layui-input" style="align-self: center;width: 200px" id="finance-usage"/>
            </div>
            <button class="layui-btn" style="margin-top: 15px;cursor: pointer;margin-bottom: 30px" id="finance-button">
                修改
            </button>
        </div>
    </div>
</div>

<div th:replace="template.html::footer"></div>
</body>
</html>
